
<div class="wrapper wrapper-content page-heading animated fadeInRight">
    <div class="row">
        <div class="col-lg-9">
            <div class="tabs-container">
                <ul class="nav nav-tabs" id="tab-list-2">
                    <li class="links active" id="search-link"><a href="#search" role="tab" data-toggle="tab">Report</a></li>
                </ul>
                <div class="tab-content">
                   <div id="search" class="tab-pane active">
                        <div class="panel-body">
                            <div class="ibox-title" style="border: none;">
                              <h5 style="color: #00afef"><i>Receipt History</i></h5>
                            </div>
                           <div class="ibox-content">
                            <form class="form-horizontal" id="th_report">

                              <div class="form-group">
                                <label class="col-lg-3 control-label">Account Number</label>
                                  <div class="col-lg-7">
                                    <input type="text" name="acct_num" class="form-control">
                                  </div>
                              </div>

                              <div class="form-group">
                                <label class="col-lg-3 control-label">Account Name</label>
                                  <div class="col-lg-7">
                                    <input type="text" name="acct_name" class="form-control">
                                  </div>
                              </div>

                              <div class="form-group" id="th_range">
                                <label class="col-lg-3 control-label">Date From</label>
                                <div class="col-lg-7 input-daterange input-group" id="datepicker">
                                    <input type="search" class="form-control" name="th_from" value="">
                                    <span class="input-group-addon">to</span>
                                    <input type="search" class="form-control" name="th_to" value="">
                                </div>
                              </div>

                                <div class="form-group">
                                    <label class="col-sm-2 control-label"></label>
                                     <div class="col-sm-10">
                                       <div class="row">
                                       <div class="col-md-9">
                                       <p class="text-center">
                                        <button class="btn btn-primary btn-outline btn-md m-t-n-xs" id="get-status-th" type="button"><i class="fa fa-check fa-fw"></i> Get Status</button></p>
                                        </div>
                                      </div>
                                     </div>
                                  </div>
                             </form>
                           </div><!-- END OF IBOX CONTENT -->
                           <div id="result">
                              <div class="ibox-content">
                                <div class="row">
                                    <div class="col-xs-9">
                                    <div class="btn-group">
                                      <a id="to_pdf" href="#" class="btn btn-link" ><i class="fa fa-file-pdf-o fa-fw"></i> <small>Export as PDF</small></a>
                                      <a id="to_excel" href="#" class="btn btn-link" ><i class="fa fa-file-excel-o fa-fw"></i> <small>Export as Excel</small></a>
                                  </div>
                                     <!--  <div class="col-xs-3">
                                        <a id="to_pdf" class="btn btn-w-m btn-outline btn-link" href="#"><i class="fa fa-file-pdf-o fa-fw"></i> <small>Export as PDF</small></a>
                                      </div>
                                      <div class="col-xs-3">
                                        <a id="to_excel" class="btn btn-w-m btn-outline btn-link" href='#'><i class="fa fa-file-excel-o fa-fw"></i> <small>Export as Excel</small></a>
                                      </div>
                                      <div class="col-xs-3">
                                        <div class="">
                                            <button class="btn btn-w-m btn-outline btn-link dropdown-toggle" id="to_mail"><i class="fa fa-envelope-o fa-fw"></i> <small>Send to Email</small></button>
                                        </div>
                                      </div> -->
                                    </div>
                                </div>
                             </div><!-- END OF IBOX CONTENT -->
                             <br>
                             <p id="search_values"></p>
                             </br>
                             <p id="total_balances"></p>
                             <div class="horizontal-slide">
                              <div class="table-responsive">
                                <table data-limit-navigation="5" data-page-size="20" data-filter="#filter" data-page-navigation=".pagination" class="footable table table-bordered table-hover" id="tbl_org" style="width:100%">
                               <!-- <table class="footable table table-bordered table-hover"> -->
                               
                                                
                                <thead>
                                  <tr style="background-color: blue !important;">
                          
                                                    <td colspan='5' style='border: none !important;'>
                                                    </td>  
                                                    <td style='border: none !important; text-align:right;'>
                                                      <strong>Total :<strong>
                                                    </td >
                                                    <td style='border: none !important; text-align:right;' id="total_val">
                                                    </td>
                                                </tr>
                                  <tr>
                                    <th data-sort-ignore="true" ></th>
                                    <th data-type="numeric">Transact ID</th>
                                    <th data-type="alpha">Date of Transaction</th>
                                    <th data-type="numeric">Account Number</th>
                                    <th data-type="alpha">Account Name</th>
                                    <th data-type="alpha">Transact Type</th>
                                    <th data-type="alpha">Invoice Amount/Payments</th>
                                  </tr>
                                </thead>
                                <tbody id="result-table">
                                  <tr>
                                  </tr>
                                </tbody>
                                <tfoot >
                                                <tr>
                          
                                                    <td colspan="4" style='border: none !important;'>
                                                        <ul class="pagination pull-left"></ul>
                                                    </td>                                                    
                                                   
                                                </tr>

                                            </tfoot>
                              </table>
                              </div>
                            </div>
                           </div>
                           <!-- <div class="ibox-content" id="email_html" style="display: none;">
                                  <form class="form-horizontal" id="email_form">
                                      <div class="form-group"><label class="col-sm-2 control-label">From:</label>
                                          <div class="col-sm-10"><input name="email_from" type="text" class="form-control" value="no-reply@ums.com"></div>
                                      </div>
                                      <div class="form-group"><label class="col-sm-2 control-label">To:</label>
                                          <div class="col-sm-10">
                                              <input name="email_to" type="text" class="form-control" value="">
                                            <!-- <div class="input-group">
                                              <input name="email_to" type="text" class="form-control" value="">
                                              <span class="input-group-btn"><button style="padding: 4px 12px; border-radius: none;" type="button" class="btn btn-white"><i class="fa fa-group fa-fw"></i></button></span>
                                            </div> -->
                                        <!--   </div>
                                      </div>
                                      <div class="form-group"><label class="col-sm-2 control-label">Subject:</label>
                                          <div class="col-sm-10"><input name="email_subj" type="text" class="form-control" value=""></div>
                                      </div>
                                       <div class="form-group"><label class="col-sm-2 control-label">File Name:</label>
                                          <div class="col-sm-10"><input name="email_filename" type="text" class="form-control" value=""></div>
                                      </div>
                                      <div class="form-group"><label class="col-sm-2 control-label">File Type:</label>
                                         <div class="col-sm-10"><label class="checkbox-inline">
                                          <input type="checkbox" name="email_topdf" value="pdf" checked> PDF (.pdf) </label> <label class="checkbox-inline">
                                          <input type="checkbox" name="email_toexcel" value="excel" > EXCEL (.xls) </label>
                                          <input style="border: none; width:0px" readonly type="text" name="email_error" value="">
                                        </div>
                                      </div>
                                       <div class="form-group"><label class="col-sm-2 control-label">Message:</label>
                                          <div class="col-sm-10">
                                            <div id="summernote"></div>
                                          </div>
                                      </div>
                                      <div class="form-group"><label class="col-sm-2 control-label"></label>
                                         <div class="col-sm-10">
                                           <button type="button" class="btn btn-white btn-md m-t-n-xs pull-right" id="email_cancel">Close</button>
                                           <button type="button" class="btn btn-success btn-md m-t-n-xs pull-right btn-margin-right" id="email_send">Send</button>
                                        </div>
                                      </div>
                                  </form> -->
                              <!-- </div> -->
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div><!-- END of class row-->
</div>
<script>
      $(document).ready(function(){
        $('#th_range .input-daterange').datepicker({
            keyboardNavigation: false,
            forceParse: false,
            autoclose: true,
            format: "dd-M-yy"
        });
         $('#to_excel').hide();  $('#to_pdf').hide();

        // $('.footable').footable();
       // $('#summernote').summernote({
       //    disableDragAndDrop: true,
       //    shortcuts: false,
       //    height: 200,
       //    placeholder: 'write here...',
       //    toolbar: [
       //      ['para', ['ul', 'ol']]
       //    ]
       //  });


        $('#get-status-th').click(function(){
          var total_balances = 0;
          $.ajax({
                        type: "POST",
                         url: "<?php echo base_url($this->session->userdata('forajax')); ?>/get_status_th",
                        data: $('#th_report').serialize(),
                        dataType: 'json',
                        success: function(data){
                           $('#get-status').removeAttr('disabled');
                            var tmp = "";
                            console.log(data.length);
                            if(data.length == 0){
                               $('#result-table').html('<tr><td colspan="11" align="center">No Result</td></tr>');
                               $('#to_excel').hide();
                               $('#to_pdf').hide();
                                $('#search_values').html('');
                                $('#search_values').hide();
                            }else{
                              $('#search_values').show();
                               $('#search_values').html('Account Number: <strong>' + $('input[name=acct_num]').val() + '</strong></br>Account Name: <strong>' + $('input[name=acct_name]').val() + '</strong></br>Reading Date From: <strong>' + $('input[name=mr_from]').val() + '</strong> to <strong>' + $('input[name=mr_to]').val() + '</strong>');
                              $.each(data,function(i,item){
                                if(data[i].types == 'PAYMENT'){
                                  tmp += '<tr><td></td><td>'+ data[i].invoice_num +'</td><td align="center">'+ data[i].invoice_date +'</td><td align="center">'+ data[i].account_num +'</td><td align="left">'+ data[i].acct_name +'</td><td align="center">'+ data[i].types +'</td><td align="right">'+ data[i].invoice_total +'</td></tr>' 
                                  var bal_temp = "" ;
                                  bal_temp = data[i].invoice_total.replace('(','');
                                  bal_temp = bal_temp.replace(')','');
                                  total_balances = parseFloat(total_balances) - parseFloat(bal_temp);
                                  
                                  }
                                else{
                                  tmp += '<tr><td></td><td>'+ data[i].invoice_num +'</td><td align="center">'+ data[i].invoice_date +'</td><td align="center">'+ data[i].account_num +'</td><td align="left">'+ data[i].acct_name +'</td><td align="center">'+ data[i].types +'</td><td align="right">'+ data[i].invoice_total +'</td></tr>'
                                  bal_temp = data[i].invoice_total.replace('(','');
                                  bal_temp = bal_temp.replace(')','');
                                  total_balances = parseFloat(total_balances) + parseFloat(bal_temp);
                                  }                            
                                });
                              $('#result-table').html(tmp).trigger('footable_redraw');
                              $('#to_excel').attr('href','<?php echo base_url($this->session->userdata("forajax")); ?>/gen_excel?acct_num='+$('input[name=acct_num]').val()+'&acct_name='+$('input[name=acct_name]').val()+'&th_from='+$('input[name=th_from]').val()+'&th_to='+$('input[name=th_to').val());
                              $('#to_pdf').attr('href','<?php echo base_url($this->session->userdata("forajax")); ?>/gen_pdf?acct_num='+$('input[name=acct_num]').val()+'&acct_name='+$('input[name=acct_name]').val()+'&th_from='+$('input[name=th_from]').val()+'&th_to='+$('input[name=th_to]').val());
                              $('#to_excel').show();
                              $('#to_pdf').show();
                             $('#total_val').html('<strong>' + total_balances + '</strong>');
                              sessionStorage.acct_num = $('input[name=acct_num]').val();
                              sessionStorage.acct_nme = $('input[name=acct_name]').val();
                              sessionStorage.th_from = $('input[name=th_from]').val();
                              sessionStorage.th_to = $('input[name=th_to]').val();
                            }
                            $('#result').show();
                        },
                        complete: function() {
                           $('#get-status-th').removeAttr('disabled');
                        },
                        beforeSend: function(){
                           $('#get-status-th').attr('disabled',true);
                           //$('#result').hide();
                        }
                    });

        });




 
      });
</script>